<!DOCTYPE html>
<html lang="zh-CN">

	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
		<meta name="description" content="">
		<meta name="author" content="">
		<link rel="icon" href="../favicon.ico">

		<title>Tyy English Word</title>

		<!-- Bootstrap core CSS -->
		<link href="http://cdn.bootcss.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet">
		<!-- Bootstrap theme -->
		<link href="http://cdn.bootcss.com/bootstrap/3.3.4/css/bootstrap-theme.min.css" rel="stylesheet">

		<link href="http://cdn.bootcss.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet">
		<!-- Custom styles for this template -->
		<link href="../css/theme.css" rel="stylesheet">

		<script src="http://cdn.bootcss.com/jquery/1.11.2/jquery.min.js"></script>
		<script src="http://cdn.bootcss.com/scrollup/2.4.0/jquery.scrollUp.min.js"></script>
		<script src="../js/question.js"></script>

		<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
		<!--[if lt IE 9]>
      <script src="http://cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="http://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
	</head>

	<body role="document">

		<!-- Fixed navbar -->
		<nav class="navbar navbar-inverse navbar-fixed-top">
			<div class="container">
				<div class="navbar-header">
					<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
						<span class="sr-only">Toggle navigation</span>
						<span class="icon-bar"></span>
						<span class="icon-bar"></span>
						<span class="icon-bar"></span>
					</button>
					<a class="navbar-brand" href="#">TyEnWord</a>
				</div>
				<div id="navbar" class="navbar-collapse collapse">
					<ul class="nav navbar-nav">
						<li class="active"><a href="#">Home</a>
						</li>
						<li><a href="#about">About</a>
						</li>
						<li><a href="#contact">Contact</a>
						</li>
						<li class="dropdown">
							<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">Dropdown <span class="caret"></span></a>
							<ul class="dropdown-menu" role="menu">
								<li><a href="#">Action</a>
								</li>
								<li><a href="#">Another action</a>
								</li>
								<li><a href="#">Something else here</a>
								</li>
								<li class="divider"></li>
								<li class="dropdown-header">Nav header</li>
								<li><a href="#">Separated link</a>
								</li>
								<li><a href="#">One more separated link</a>
								</li>
							</ul>
						</li>
					</ul>
					<ul class="navbar-form navbar-right">
			            <a href="#Login" class="btn btn-info">Login</a>
			            <a href="#Login" class="btn btn-primary">Sign Up</a>
					</ul>
					<ul class="nav navbar-nav navbar-right">
						<li class="dropdown">
							<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">User Name<span class="caret"></span></a>
							<ul class="dropdown-menu" role="menu">
								<li><a href="#">Personal data</a>
								</li>
								<li class="divider"></li>
								<li><a href="#">Log out</a>
								</li>
							</ul>
						</li>
					</ul>
				</div>
				<!--/.nav-collapse -->
			</div>
		</nav>

		<div class="container theme-showcase" role="main">
			<!-- Main jumbotron for a primary marketing message or call to action -->
			<div class="jumbotron">
				<h1 id="unit" attr="1">Unit 1</h1>
				<h2 id="book" attr="1212">大学英语三<small>第二版</small></h2>
			</div>
			<div id="result" class="panel panel-primary">
				<div class="panel-heading">Result</div>
				<div class="panel-body">
					<div class="progress">
						<div id="success-count" class="progress-bar progress-bar-success progress-bar-striped active" style="width: 35%">
							35%
							<span class="sr-only">35% Complete (success)</span>
						</div>
						<div id="error-count" class="progress-bar progress-bar-danger progress-bar-striped active" style="width: 20%">
							20%
							<span class="sr-only">20% Complete (warning)</span>
						</div>
						<div id="warning-count" class="progress-bar progress-bar-warning" style="width: 45%">
							45%
							<span class="sr-only">45% Complete (danger)</span>
						</div>
					</div>
					<button id="show-all" class="btn btn-info">Show All Result</button>
				</div>
			</div>
			<div class="page-header">
				<h1>Tables</h1>
			</div>
			<div class="row">
				<div class="col-md-12">
					<table id="questions" class="table table-bordered">
						<thead>
							<tr>
								<th>Index</th>
								<th>Words</th>
								<th>Translation</th>
								<th class="answer">Answer</th>
							</tr>
						</thead>
						<tbody>
							<tr attr="w-3513" class="danger">
								<td>1</td>
								<td>delivery</td>
								<td>
									<input type="text" class="form-control" />
								</td>
								<td class="answer">
									<button type="button" class="btn btn-danger" data-container="body" data-toggle="popover" data-placement="top" data-content="Answer">
										Show Answer
									</button>
								</td>
							</tr>
							<tr attr="w-3514" class="success">
								<td>2</td>
								<td>saint</td>
								<td>
									<input type="text" class="form-control" disabled="true" value="Answer"/>
								</td>
								<td class="answer">
									<button type="button" class="btn btn-success" data-container="body" data-toggle="popover" data-placement="top" data-content="Answer">
										Show Answer
									</button>
								</td>
							</tr>
							<tr attr="w-3515" class="warning">
								<td>3</td>
								<td>justice</td>
								<td>
									<input type="text" class="form-control" >
								</td>
								<td class="answer">
									<button type="button" class="btn btn-warning" data-container="body" data-toggle="popover" data-placement="top" data-content="Answer">
										Show Answer
									</button>
								</td>
							</tr>
						</tbody>
					</table>
				</div>
			</div>
			<!-- <span class="label label-danger">Danger</span> -->
			<button id="submit" type="button" class="btn btn-lg btn-primary">Submit</button>

		</div>
		<!-- /container -->

		<footer class="footer">
			<div class="container">
				<p class="text-center">CREATE BY <a href="http://www.tianyiyan.com">TIANYIYAN</a>.</p>
			</div>
		</footer>
		<!-- Bootstrap core JavaScript
    ================================================== -->
		<!-- Placed at the end of the document so the pages load faster -->
		<script src="http://cdn.bootcss.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
		
		<!-- <script src="../../assets/js/docs.min.js"></script> -->
		<!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
		<!-- <script src="../../assets/js/ie10-viewport-bug-workaround.js"></script> -->
	</body>

</html>